
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>home</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="keywords" content="">
    <meta name="description" content="">
    
        <link rel="icon" href="/favicon.ico">
    
    
        
            <link rel="stylesheet" href="/lib/font-awesome/css/font-awesome.min.css">
        
            <link rel="stylesheet" href="/css/stage.css">
        
            <link rel="stylesheet" href="/css/avatar-bg.css">
        
    
<meta name="generator" content="Hexo 4.2.0"></head>

<body>
<header id="header">
    <div class="menu">
        <i class="fa fa-bars"></i>
    </div>
    <div class="header-main">
        <h1><a href="/">home</a></h1>
    </div>
    <div id="nav">
        <div class="nav-img" id="nav-img"></div>
        <div class="sentences">
            人生贵相知，何用金与钱。——李白
        </div>
    </div>
</header>

<div id="content-outer">
    <div id="content-inner">
        <div class="clearfix">
    
    <div id="recent-posts">
        
            <div class="post-item">
                <h1>
                    <a href="/hexo_blog/2020/04/21/day002/">
                        Hugo
                    </a>
                </h1>
                <div class="create">
                    <span>Created</span>
                    
                        <time datetime="2020-04-20T21:40:46.000Z">
                            2020-04-21
                        </time>
                    
                    
                </div>
                
                    <h1 id="hugo的配置"><a href="#hugo的配置" class="headerlink" title="hugo的配置"></a>hugo的配置</h1><p>搭建<br>hugo new site 搭建站点名称<br>hugo new site hugo_blog</p>
<h1 id="起hugo服务"><a href="#起hugo服务" class="headerlink" title="起hugo服务"></a>起hugo服务</h1><p>hugo server</p>
<h1 id="配置颜色的网站"><a href="#配置颜色的网站" class="headerlink" title="配置颜色的网站"></a>配置颜色的网站</h1><p><a href="https://colorhunt.co/" target="_blank" rel="noopener">https://colorhunt.co/</a></p>
<p>中国色<br><a href="http://zhongguose.com/" target="_blank" rel="noopener">http://zhongguose.com/</a></p>
<hr>
<h1 id="hugo创建新的文章"><a href="#hugo创建新的文章" class="headerlink" title="hugo创建新的文章"></a>hugo创建新的文章</h1><p>hugo new 名字.md<br>hugo new day001.md</p>
<hr>
<h1 id="提交hugo流程"><a href="#提交hugo流程" class="headerlink" title="提交hugo流程"></a>提交hugo流程</h1><p>1、先进行打包，在hugo页面进行直接打包<br>2、cd pulic中<br>3、git add -A<br>4、git commit -m’修改简介’<br>5、git remote add origin <a href="https://gitee.com/song_shen_olympic/库名.git" target="_blank" rel="noopener">https://gitee.com/song_shen_olympic/库名.git</a><br>6、git push origin master<br>7、进入到gitee库中找到服务中的gitee pages<br>8、勾选强制使用HTTPS，可以不勾选<br>9、点击启动<br>10、每次有新的变动直接点击更新键就行</p>
<p><img src="/hugo_blog/7f5c17485943c555cbe12e3758a08f29.jpg" alt="每日一图"></p>

                
                <div class="readmore">
                    <a href="/hexo_blog/2020/04/21/day002/">
                        Read More
                    </a>
                </div>
            </div>
        
            <div class="post-item">
                <h1>
                    <a href="/hexo_blog/2020/04/21/Django/">
                        Django
                    </a>
                </h1>
                <div class="create">
                    <span>Created</span>
                    
                        <time datetime="2020-04-20T17:32:11.000Z">
                            2020-04-21
                        </time>
                    
                    
                </div>
                
                    <h1 id="创建表字段"><a href="#创建表字段" class="headerlink" title="创建表字段"></a>创建表字段</h1><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br></pre></td><td class="code"><pre><span class="line">from django.db import models</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"># 导入时间域</span><br><span class="line">from django.utils import timezone</span><br><span class="line"></span><br><span class="line"># 基类</span><br><span class="line">class Base(models.Model):</span><br><span class="line"></span><br><span class="line">    #创建时间</span><br><span class="line">    create_time &#x3D; models.DateTimeField(default&#x3D;timezone.now,null&#x3D;True)</span><br><span class="line"></span><br><span class="line">    class Meta:</span><br><span class="line">        abstract &#x3D; True</span><br><span class="line"></span><br><span class="line"># 用户表</span><br><span class="line">class User(Base):</span><br><span class="line"></span><br><span class="line">    #用户名</span><br><span class="line">    username &#x3D; models.CharField(max_length&#x3D;200)</span><br><span class="line"></span><br><span class="line">    #密码</span><br><span class="line">    password &#x3D; models.CharField(max_length&#x3D;200)</span><br><span class="line"></span><br><span class="line">    #头像</span><br><span class="line">    img &#x3D; models.CharField(max_length&#x3D;200)</span><br><span class="line"></span><br><span class="line">    #用户级别,0代表普通用户，1代表超级管理员，2网站编辑</span><br><span class="line">    usertype &#x3D; models.IntegerField(default&#x3D;0,null&#x3D;True)</span><br><span class="line"></span><br><span class="line">    #手机号</span><br><span class="line">    phone &#x3D; models.IntegerField()</span><br><span class="line"></span><br><span class="line">    #个人主页</span><br><span class="line">    num &#x3D; models.IntegerField(default&#x3D;0,null&#x3D;True)</span><br><span class="line"></span><br><span class="line">    #声明表名</span><br><span class="line">    class Meta:</span><br><span class="line">        db_table &#x3D; &#39;user&#39;</span><br></pre></td></tr></table></figure>

<h1 id="数据库迁移"><a href="#数据库迁移" class="headerlink" title="数据库迁移"></a>数据库迁移</h1><p>python manage.py makemigrations 项目名<br>python manage.py makemigrations myapp<br>注意：一定要加项目名称，不然myapp中models.py中的表就迁移不到数据库中<br>然后执行：python manage.py migrate</p>
<h5 id="在数据库迁移不成功时，可以选择手动建表，用反向迁移将字段迁移到pymodels-py中，命令：（python-manage-py-inspectdb-gt-app01-models-py"><a href="#在数据库迁移不成功时，可以选择手动建表，用反向迁移将字段迁移到pymodels-py中，命令：（python-manage-py-inspectdb-gt-app01-models-py" class="headerlink" title="在数据库迁移不成功时，可以选择手动建表，用反向迁移将字段迁移到pymodels.py中，命令：（python manage.py inspectdb &gt; app01/models.py"></a>在数据库迁移不成功时，可以选择手动建表，用反向迁移将字段迁移到pymodels.py中，命令：（python manage.py inspectdb &gt; app01/models.py</h5><p>）</p>
<h1 id="导包时注意事项"><a href="#导包时注意事项" class="headerlink" title="导包时注意事项"></a>导包时注意事项</h1><p>from 项目名.models import User<br>from myapp.models import User<br>在哪个项目中就用哪个项目名</p>
<h1 id="md5加密"><a href="#md5加密" class="headerlink" title="md5加密"></a>md5加密</h1><p>要将需要加密的变量进行强转，强转成字符串，然后进行编码</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"># md5加密方法</span><br><span class="line">def make_pasword(mypass):</span><br><span class="line"></span><br><span class="line">    #生成md5对象</span><br><span class="line">    md5 &#x3D; hashlib.md5()</span><br><span class="line"></span><br><span class="line">    #转码操作</span><br><span class="line">    mypass_utf8 &#x3D; str(mypass).encode(encoding&#x3D;&#39;utf-8&#39;)</span><br><span class="line"></span><br><span class="line">    #进行加密操作</span><br><span class="line">    md5.update(mypass_utf8)</span><br><span class="line"></span><br><span class="line">    #返回密文</span><br><span class="line">    return md5.hexdigest()</span><br></pre></td></tr></table></figure>



<p><img src="/hugo_blog/0d8a90abc2d78eaa5e01d3fb7f57e6da.jpg" alt="美图"></p>

                
                <div class="readmore">
                    <a href="/hexo_blog/2020/04/21/Django/">
                        Read More
                    </a>
                </div>
            </div>
        
            <div class="post-item">
                <h1>
                    <a href="/hexo_blog/2020/04/21/day03/">
                        简易购物车
                    </a>
                </h1>
                <div class="create">
                    <span>Created</span>
                    
                        <time datetime="2020-04-20T17:32:11.000Z">
                            2020-04-21
                        </time>
                    
                    
                </div>
                
                    <h1 id="VUE的架构"><a href="#VUE的架构" class="headerlink" title="VUE的架构"></a>VUE的架构</h1><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br></pre></td><td class="code"><pre><span class="line">&lt;template&gt;</span><br><span class="line">    &lt;div&gt;</span><br><span class="line">        &lt;!-- 购物车 --&gt;</span><br><span class="line">        &lt;table&gt;</span><br><span class="line">            &lt;tr&gt;</span><br><span class="line">                &lt;td&gt;商品名称&lt;&#x2F;td&gt;</span><br><span class="line">                &lt;td&gt;商品数量&lt;&#x2F;td&gt;</span><br><span class="line">                &lt;td&gt;商品价格&lt;&#x2F;td&gt;</span><br><span class="line">            &lt;&#x2F;tr&gt;</span><br><span class="line">            &lt;tr v-for&#x3D;&quot;(item,index) in tlist&quot;&gt;</span><br><span class="line">                &lt;td&gt;&#123;&#123; item.text &#125;&#125;&lt;&#x2F;td&gt;</span><br><span class="line">                &lt;td&gt;</span><br><span class="line">                    &lt;button @click&#x3D;&quot;minus(index)&quot;&gt;+&lt;&#x2F;button&gt;</span><br><span class="line">                    &lt;input type&#x3D;&quot;text&quot; v-model&#x3D;&quot;item.num&quot;&gt;</span><br><span class="line">                    &lt;button @click&#x3D;&quot;add(index)&quot;&gt;+&lt;&#x2F;button&gt;</span><br><span class="line">                &lt;&#x2F;td&gt;</span><br><span class="line">                &lt;td&gt;&#123;&#123; item.price &#125;&#125;&lt;&#x2F;td&gt;</span><br><span class="line">            &lt;&#x2F;tr&gt;</span><br><span class="line">        &lt;&#x2F;table&gt;</span><br><span class="line">        &lt;p&gt;总数量:&#123;&#123;totalcount()&#125;&#125;        总价格:&#123;&#123;pricecount()&#125;&#125;&lt;&#x2F;p&gt;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">        &lt;button @click&#x3D;&quot;counter++&quot;&gt;+&lt;&#x2F;button&gt;</span><br><span class="line">        &#123;&#123;counter&#125;&#125;</span><br><span class="line">        &lt;button @click&#x3D;&quot;counter--&quot;&gt;-&lt;&#x2F;button&gt;</span><br><span class="line">        </span><br><span class="line">        &#123;&#123;reverse_msg&#125;&#125;</span><br><span class="line">        &lt;ul&gt;</span><br><span class="line">            &lt;li v-for&#x3D;&quot;(item,index) in tlist&quot;:class&#x3D;&quot;&#123;on:index%2&#x3D;&#x3D;0,off:index%2!&#x3D;0&#125;&quot;&gt;</span><br><span class="line">                &#123;&#123;item.text&#125;&#125;</span><br><span class="line">            &lt;&#x2F;li&gt;</span><br><span class="line">        &lt;&#x2F;ul&gt;</span><br><span class="line"></span><br><span class="line">        &lt;div v-html&#x3D;&quot;msg&quot;&gt;&lt;&#x2F;div&gt;</span><br><span class="line">        &#123;&#123;msg&#125;&#125;</span><br><span class="line">        &lt;h1&gt;&#123;&#123;msg&#125;&#125;&lt;&#x2F;h1&gt;  </span><br><span class="line">        &lt;h2 v-show&#x3D;&quot;ok&quot;&gt;Hello world&lt;&#x2F;h2&gt;</span><br><span class="line">        &lt;h2 v-if&#x3D;&quot;ok&quot;&gt;Hello world&lt;&#x2F;h2&gt;</span><br><span class="line"></span><br><span class="line">        &lt;div v-if&#x3D;&quot;type &#x3D;&#x3D;&#x3D; &#39;A&#39;&quot;&gt;A&lt;&#x2F;div&gt;</span><br><span class="line">        &lt;div v-else-if&#x3D;&quot;type &#x3D;&#x3D;&#x3D; &#39;B&#39;&quot;&gt;B&lt;&#x2F;div&gt;</span><br><span class="line">        &lt;div v-else&gt;不是A也不是B&lt;&#x2F;div&gt;</span><br><span class="line">    &lt;&#x2F;div&gt;</span><br><span class="line">&lt;&#x2F;template&gt;</span><br><span class="line"></span><br><span class="line">&lt;script&gt;</span><br><span class="line">export default &#123;</span><br><span class="line">    &#x2F;&#x2F;定义数据</span><br><span class="line">    data()&#123;</span><br><span class="line">        return&#123;</span><br><span class="line">            msg:&#39;这是一个变量&#39;,</span><br><span class="line">            ok:0,</span><br><span class="line">            type:&#39;A&#39;,</span><br><span class="line">            tlist:[&#123;text:&#39;汽车&#39;,num:1,price:200&#125;,&#123;text:&#39;化妆品&#39;,num:1,price:50&#125;,&#123;text:&#39;衣服&#39;,num:1,price:30&#125;,&#123;text:&#39;牛奶&#39;,num:1,price:2&#125;],</span><br><span class="line">            counter:0</span><br><span class="line">        &#125;</span><br><span class="line">    &#125;,</span><br></pre></td></tr></table></figure>
<h1 id="计算属性"><a href="#计算属性" class="headerlink" title="计算属性"></a>计算属性</h1><h3 id="1、字符串反转"><a href="#1、字符串反转" class="headerlink" title="1、字符串反转"></a>1、字符串反转</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">&#x2F;&#x2F;计算属性</span><br><span class="line">computed:&#123;</span><br><span class="line">    reverse_msg:function()&#123;</span><br><span class="line">        console.log(this.msg.split(&#39;&#39;));</span><br><span class="line">        return this.msg.split(&#39;&#39;).reverse().join(&#39;&#39;);</span><br><span class="line">    &#125;</span><br><span class="line">&#125;,</span><br></pre></td></tr></table></figure>
<h3 id="2、将变量的值每次更改打印到控制台"><a href="#2、将变量的值每次更改打印到控制台" class="headerlink" title="2、将变量的值每次更改打印到控制台"></a>2、将变量的值每次更改打印到控制台</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">watch:&#123;</span><br><span class="line">    counter:function(nval,oval)&#123;</span><br><span class="line">        console.log(&#39;计算器由&#39;+oval+&#39;变换为新的&#39;+nval)</span><br><span class="line">    &#125;</span><br><span class="line">&#125;,</span><br><span class="line">&#x2F;&#x2F;钩子方法  created</span><br><span class="line">mounted:function()&#123;</span><br><span class="line"></span><br><span class="line">&#125;,</span><br></pre></td></tr></table></figure>
<h1 id="自定义方法"><a href="#自定义方法" class="headerlink" title="自定义方法"></a>自定义方法</h1><h3 id="汇总数量，遍历tlist，将每条的num参数依次累加，得出总数量"><a href="#汇总数量，遍历tlist，将每条的num参数依次累加，得出总数量" class="headerlink" title="汇总数量，遍历tlist，将每条的num参数依次累加，得出总数量"></a>汇总数量，遍历tlist，将每条的num参数依次累加，得出总数量</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">&#x2F;&#x2F;自定义方法</span><br><span class="line">methods:&#123;</span><br><span class="line">    &#x2F;&#x2F;汇总数量</span><br><span class="line">    totalcount:function()&#123;</span><br><span class="line">        let total&#x3D;0;</span><br><span class="line">        for(let i&#x3D;0,l&#x3D;this.tlist.length;i&lt;l;i++)&#123;</span><br><span class="line">            total +&#x3D; this.tlist[i].num;</span><br><span class="line">        &#125;</span><br><span class="line"></span><br><span class="line">        return total;</span><br><span class="line">    &#125;,</span><br></pre></td></tr></table></figure>

<h3 id="汇总价格，遍历tlist，将每条的num参数和price相乘后得到单品总价，然后相加到pricenum变量中，得出总价格"><a href="#汇总价格，遍历tlist，将每条的num参数和price相乘后得到单品总价，然后相加到pricenum变量中，得出总价格" class="headerlink" title="汇总价格，遍历tlist，将每条的num参数和price相乘后得到单品总价，然后相加到pricenum变量中，得出总价格"></a>汇总价格，遍历tlist，将每条的num参数和price相乘后得到单品总价，然后相加到pricenum变量中，得出总价格</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">&#x2F;&#x2F;汇总价格</span><br><span class="line">pricecount:function()&#123;</span><br><span class="line">    let pricenum&#x3D;0;</span><br><span class="line">    for(let i&#x3D;0,l&#x3D;this.tlist.length;i&lt;l;i++)&#123;</span><br><span class="line">        pricenum +&#x3D; this.tlist[i].price*this.tlist[i].num;</span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">    return pricenum;</span><br><span class="line">&#125;,</span><br></pre></td></tr></table></figure>

<h3 id="购物车数量的减少，this-tlist-index-num-gt-0判断数量是否大于0，如果大于0则可以减，如果小于0，不改变"><a href="#购物车数量的减少，this-tlist-index-num-gt-0判断数量是否大于0，如果大于0则可以减，如果小于0，不改变" class="headerlink" title="购物车数量的减少，this.tlist[index].num&gt;0判断数量是否大于0，如果大于0则可以减，如果小于0，不改变"></a>购物车数量的减少，this.tlist[index].num&gt;0判断数量是否大于0，如果大于0则可以减，如果小于0，不改变</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">&#x2F;&#x2F;购物车减法</span><br><span class="line">minus:function(index)&#123;</span><br><span class="line">    if(this.tlist[index].num&gt;0)&#123;</span><br><span class="line">        this.tlist[index].num--</span><br><span class="line">    &#125;else&#123;</span><br><span class="line">        this.tlist[index].num</span><br><span class="line">    &#125;</span><br><span class="line">&#125;,</span><br></pre></td></tr></table></figure>

<h3 id="购物车数量的增加，将下标传下来，将数量进行增加，一次加1"><a href="#购物车数量的增加，将下标传下来，将数量进行增加，一次加1" class="headerlink" title="购物车数量的增加，将下标传下来，将数量进行增加，一次加1"></a>购物车数量的增加，将下标传下来，将数量进行增加，一次加1</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><span class="line">        &#x2F;&#x2F;购物车加法</span><br><span class="line">        add:function(index)&#123;</span><br><span class="line">            this.tlist[index].num++</span><br><span class="line">        &#125;</span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line">&lt;&#x2F;script&gt;</span><br><span class="line"></span><br><span class="line">&lt;style&gt;</span><br><span class="line"></span><br><span class="line">.on &#123;background-color: blue;color:thistle;font-size: 20px&#125;</span><br><span class="line">.off &#123;background-color: red;color: black;font-size: 30px&#125;</span><br><span class="line"></span><br><span class="line">&lt;&#x2F;style&gt;</span><br></pre></td></tr></table></figure>

<h1 id="vue-中的方法"><a href="#vue-中的方法" class="headerlink" title="vue 中的方法"></a>vue 中的方法</h1><h3 id="v-html-””-展示变量"><a href="#v-html-””-展示变量" class="headerlink" title="v-html=”” 展示变量"></a>v-html=”” 展示变量</h3><h3 id="v-show-””-如果是True则显示，如果是Flase则不显示"><a href="#v-show-””-如果是True则显示，如果是Flase则不显示" class="headerlink" title="v-show=”” 如果是True则显示，如果是Flase则不显示"></a>v-show=”” 如果是True则显示，如果是Flase则不显示</h3><h3 id="v-if-”type-’’”判断条件满足时显示"><a href="#v-if-”type-’’”判断条件满足时显示" class="headerlink" title="v-if=”type===’’”判断条件满足时显示"></a>v-if=”type===’’”判断条件满足时显示</h3><h3 id="v-else-if-”type-‘’”判断满足条件时显示"><a href="#v-else-if-”type-‘’”判断满足条件时显示" class="headerlink" title="v-else-if=”type === ‘’”判断满足条件时显示"></a>v-else-if=”type === ‘’”判断满足条件时显示</h3><h3 id="v-else-如果条件都不满足则显示"><a href="#v-else-如果条件都不满足则显示" class="headerlink" title="v-else  如果条件都不满足则显示"></a>v-else  如果条件都不满足则显示</h3><h3 id="v-for-”-item-index-in-tlist”-遍历tlist，提取其中的item和index"><a href="#v-for-”-item-index-in-tlist”-遍历tlist，提取其中的item和index" class="headerlink" title="v-for=”(item,index) in tlist” 遍历tlist，提取其中的item和index"></a>v-for=”(item,index) in tlist” 遍历tlist，提取其中的item和index</h3><p><img src="/hugo_blog/5ba58572111d481045b9894394b50afe.jpg" alt="美图"><br><img src="/hugo_blog/5e531bfe76e1831109f79c4222d865c0.jpg" alt="美图"><br><img src="/hexo_blog/34339465.jpg" alt="美图"></p>

                
                <div class="readmore">
                    <a href="/hexo_blog/2020/04/21/day03/">
                        Read More
                    </a>
                </div>
            </div>
        
    </div>


    <div id="content-aside">
    <div class="content-aside-owner">
        <div id="owner">
    <div class="avatar-bg">
        <div class="index-page">
            <div class="banner">
                <div class="slide slide1">
                    <div class="bg-wrapper">
                        <div class="bg" id="container_left">
                            <div id="canvas_left"></div>
                        </div>
                    </div>
                </div>
                <div class="slide slide2">
                    <div class="bg-wrapper">
                        <div class="bg" id="container_right">
                            <div id="canvas_right"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <a href="/"><img class="avatar" src="/images/touxiang.jpg" alt=""></a>
    <a href="/"><h3 class="author">Mr.Song</h3></a>
    <h4></h4>
    <div class="social">
        
            
              <a href="https://github.com/markyong" title="github" class="fa fa-github" target="_blank"></a>
            
        
            
              <a href="#" title="weibo" class="fa fa-weibo" target="_blank"></a>
            
        
    </div>
</div>
    </div>
    
        <div class="content-aside-about">
            <h2>
                <a href="/about">About</a>
            </h2>
        </div>
    
    <div class="content-aside-tags">
        <h2>
            <a href="/tags">
                Tags
                <sup style="font-size: 12px">
                    [4]
                </sup>
            </a>
        </h2>
    </div>
    
<aside id="categories">
    <h2>Categories</h2>
    
        <p>None.</p>
    
</aside>

    
<aside id="acchives">
    <h2>Archives</h2>
    
    <ul class="archive-list"><li class="archive-list-item"><a class="archive-list-link" href="/hexo_blog/archives/2020/05/">May 2020</a></li><li class="archive-list-item"><a class="archive-list-link" href="/hexo_blog/archives/2020/04/">April 2020</a></li></ul>
    
</aside>

</div>

</div>
<nav id="pagination" class="clearfix">
    <a class="extend prev" rel="prev" href="/hexo_blog/">&amp;laquo; Prev</a><a class="page-number" href="/hexo_blog/">1</a><span class="page-number current">2</span>
</nav>

    </div>
</div>
<footer id="footer">
    <div id="copyright">&copy; Mr.Song  2020</div>
    <div id="theme">
        Powered by <a href="http://hexo.io" target="_blank" rel="noopener">Hexo</a>. Theme by <a href="https://github.com/markyong/hexo-theme-stage" target="_blank" rel="noopener">Stage</a>
    </div>
</footer>
<script src="/lib/js/waterrippleeffect.min.js"></script>
<script src="/js/header-bg.main.js"></script>

    <script src="/lib/js/cav.js"></script>
    <script src="/js/avatar-bg.main.js"></script>

</body>
</html>
